
import React, { Component } from 'react';
import { Actions, } from 'react-native-router-flux'
import {
  StyleSheet,
  View,
  Text,
} from 'react-native';
import { Button, WhiteSpace, Badge } from 'antd-mobile'
import Nav from '../nav'
import UserCenter from '../userCenter'
import Colors from '../../assets/colors'
import { DataIntro, TasksManage } from './dataIntro'

export default class IndexPage extends Component<{}> {
  render() {

    const {notip, userName, personName,role,headImg, queryInSupervision: queryInSup,
     projectsNum,unresolved, noneReceived ,thisTitle} = this.props

    return (
      <View>
        <Nav thisTitle={thisTitle}/>

        <View style={styles.container}>
          <UserCenter {...this.props} />

          <View style={styles.contentContainer}>
            <View style={styles.subContainer}>
              <DataIntro
                role={role}
                queryInSup={queryInSup}
                noneReceived={noneReceived}
                projectsNum={projectsNum}
              />
            </View>

            {
              role === '监督站长' ?
                <View style={styles.subContainer}>
                  <TasksManage
                      unresolved={unresolved}
                      notip={notip}
                  />
                </View>
                : null
            }
          </View>
        </View>

      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    display: 'flex',
    height: '90%',
    backgroundColor: Colors.contentContainerBg,
    flexDirection: 'row',
  },
  contentContainer: {
    width: '86%',
    // paddingLeft: 15,
    // paddingRight: 15,
  },
  subContainer: {
    // display: 'flex',
    // justifyContent: 'center',
    // alignItems: 'center',
    // height: 500,
    // backgroundColor: '#F5FCFF',
    // borderRadius: 4,
    // marginTop: 15,
    // marginRight: 15,
  },
});
